<template>
<div v-for="item in list" class="list">
    <div style="margin-right:1em">{{item.rank}}</div>
    <div>
        {{item.title}}
    </div>
    <van-icon class="icon" name="https://img-blog.csdnimg.cn/9893dcb48e5640a1bdbe156d5a35df72.png" />
    <van-divider :style="{ color: '#000000', borderColor: '#000000', padding: '0 5px' }"/>
</div>
</template>

<script>
import { Divider } from 'vant';
import { Icon } from 'vant';
export default {
    props:['list'],
    data(){
        return{
            list:this.list
        }
    },
    components:{
        'van-divider': Divider,
        'van-icon':Icon
    }
}
</script>

<style scoped>
.list{
    margin: 1em 0 1em 1em;
    display: flex;
    flex-direction: row;
}
.icon{
    margin-left: 3em;
}
</style>